<template>
	<div class="addContainer">
		
		<div class="addHead">
			<div class="addLeft" >
				<router-link to="/layout/service">
					<img src="../../assets/images/serviceimg/jiantou_03.png" alt="">
				</router-link>	
			</div>	
			<div class="addTitle">
				<p>新增缴费账户</p>
			</div>
			<div class="addRight">
				<p>北京市</p>
			</div>
		</div>
		
		<div class="dianfei">
			<div class="tubiao">
				
					<img src="../../assets/images/serviceimg/icon_dianfei@2x.png" alt="">
				
			</div>
			<div class="title">
				电费
			</div>
		</div>
		<div class="con">
			<span>缴费单位</span><input class="first"  type="text"  placeholder="国网北京市电力公司(智能电表)"> 
			<span>客户编号</span><input type="text" placeholder="请输入客户编号">
		</div>
		<p class="xieyi">同意<宜居自助缴费协议></p>
		<div class="next">
			<input type="button" value="下一步">
		</div>
	</div>
</template>
<script>
import ShopHeader from "../../components/shopheader"
export default{
	name:'add',
	data(){
		return{

		}
	},
	methods:{
		tiaozhuan(){

		}
	}
	
}	
</script>
<style scoped lang='less'>
.addContainer{
	overflow: hidden;
	background-color: #e6e6e6;
	height: 667/50rem;
}
	.addHead{
			width:100%;
			height:50/50rem;
			background:#ff5555;
			position: fixed;
			top:0;
			left: 0;
			overflow: hidden;
			z-index: 99;
			line-height: 50/50rem;
			color:#ffffff;
			div{
				float: left;

			}
			.addLeft{
				
				margin-left: 20/2/50rem;
				margin-right: 28/2/50rem;
				img{
					width: 35/2/50rem;
					height: 30/2/50rem;
					
				}
			}
			.addTitle{
				p{
					margin-right: 380/2/50rem;
					font-size: 30/2/50rem;
				}
			}	
	}
	.dianfei{
		margin-top: 1rem;
		widows: 100%;
		height: 100/2/50rem;
		padding-left: 41/2/50rem;
		line-height: 90/2/50rem;
		background-color: #ffffff;
		div{
			float: left;
		}	
		.tubiao{
			margin-right: 28/2/50rem;
			img{
				height:30/2/50rem
			}
		}
		.title{
			font-size: 30/2/50rem;
			font-weight:bold;
		}
	}
	.con{
		margin-top: 34/2/50rem;
		width:710/2/50rem;
		height:150/2/50rem;
		margin-left: 20/2/50rem;
		margin-top: 34/2/50rem;
		border-radius: 20/2/50rem;
		span{
			display: inline-block;
			width:18%;
			background-color: #ffffff;
			height:74/2/50rem;
			line-height: 74/2/50rem;
			padding-top: 2/2/50rem;
			padding-bottom: 2/2/50rem;
			padding-left: 10/2/50rem;


		}
		input{
			width:80%;
			height:74/2/50rem;
			border: none;


			
		}
		.first{
			border-bottom: 1px solid #e5e5e5;
		}
	}
	.xieyi{
		margin-top: 48/2/50rem;
		margin-left: 20/2/50rem;
	}
	.next{
		margin-left: 40/2/50rem;
		
		input{
			width:670/2/50rem;
			height:80/2/50rem;
			margin-top: 48/2/50rem;
			background-color: #ff5555;
			border: none;
			border-radius: 8/2/50rem;
			color:#ffffff;
		}
	}
</style>